/**
* 组合详情页
* path:'/groupdetail' ,query:{groupId:'必传',clientId:'必传'}
*/
<template>
  <div id="groupdetail" class="portfolio portfolio-detail">
    <header-top :option="headerOption"></header-top>
    <overview :clientId="clientId" :userCode="userCode" :groupName="groupName" :totalProfitRate="totalProfitRate"
              :totalProfit="totalProfit" :monthChangeCount="monthChangeCount" :createDate="createDate"
              :bstealNum="bstealNum"></overview>
    <chart :userCode="userCode" :clientId="clientId" :groupId="groupId" :entrustType="'2'"
           :userType="userCode==clientId?'self':'other'"></chart>
    <div class="portfolio-position"  :class="!isLogin && groupStatue ==1 ?'logout':''" ref="groupPosition">
      <div class="portfolio-position-list" v-if="showPosition">
        <position-transfer v-if="userCode != clientId && groupStatue < 100" :userCode="userCode"
                           :clientId="clientId" :groupId="groupId"></position-transfer>
        <position-detail :clientId="clientId" :userCode="userCode" :groupId="groupId" :groupName="groupName"
                         :groupStatue="groupStatue" :availBalance="availBalance" :totalBalance="totalBalance"
                          :emptyDate="emptyDate" :createDate="createDate"></position-detail>
      </div>
      <div class="not-login-bg" v-show="!isLogin && groupStatue ==1" ref="notLoginBg">
        <div><img src="~assets/images/portfolio/haixiuniu.png"></div>
        <div><span>你还不是持仓用户</span><span>持仓羞羞了</span></div>
        <div class="button" @click.stop.prevent="register">立即注册</div>
      </div>
    </div>
    <similar-group :clientId="clientId" :groupId="groupId" v-if="groupStatue ==1"></similar-group>
    <foot-btn v-if="groupStatue ==1 || groupStatue ==2 && userCode == clientId" :groupStatue="groupStatue"
              :clientId="clientId" :userCode="userCode" :groupName="groupName" :groupId="groupId" :isLogin="isLogin">
    </foot-btn>
    <group-learn-two-modal></group-learn-two-modal>
    <group-clearance-modal></group-clearance-modal>
  </div>
</template>

<script>
  import CommonUtil from 'common/common.util'
  import Constant from 'common/constant'
  import RemoteDAO from 'common/remoteDAO'
  import LocalDAO from 'common/localDAO'
  import HeaderTop from 'components/HeaderTop'
  import Overview from 'components/group/detail/Overview'
  import Chart from 'components/Chart'
  import PositionDetail from 'components/group/detail/PositionDetail'
  import PositionTransfer from 'components/group/detail/PositionTransfer'
  import SimilarGroup from 'components/group/detail/SimilarGroup'
  import FootBtn from 'components/group/detail/FootBtn'
  import GroupClearanceModal from 'components/modal/GroupClearanceModal'
  import GroupLearnTwoModal from 'components/modal/GroupLearnTwoModal'
  import _ from 'underscore'

  export default {
    name: 'GroupDetail',
    data () {
      return {
        userCode: LocalDAO.getUserCode(), // 当前用户ID,
        clientId: '', // 组合创建人ID
        groupId: '',  // 组合ID
        groupName: '--', //组合名字
        totalProfitRate: '--', // 总收益率
        totalProfit: '--', // 总收益
        monthChangeCount: '--', //月调仓次数
        createDate: '----', // 创建日期
        bstealNum: '--', // 被偷师次数
        totalBalance: 0, //组合总资产
        availBalance: 0, //组合可用资产
        emptyDate: 0, //空仓日期
        groupStatue: 1, //组合状态
        headerOption: {
          title: '',
          leftBtn: Constant.leftBtn.BACK,
          operations: [Constant.operation.REFRESH, Constant.operation.SHARE],
          page: Constant.storage.SHARE_GROUP
        },
        isLogin:false,
        error: 'error',
        showPosition:false
      }
    },
    components: {
      'header-top': HeaderTop,
      'overview': Overview,
      'chart': Chart,
      'position-transfer': PositionTransfer,
      'position-detail': PositionDetail,
      'similar-group': SimilarGroup,
      'foot-btn': FootBtn,
      'group-clearance-modal':GroupClearanceModal,
      'group-learn-two-modal':GroupLearnTwoModal,
    },
    created: function () {
      this.fetchData();
    },
    mounted:function(){
      this.getCss()
    },
    watch: {
      '$route.query.groupId' (to, from) {
        //跳转相同页面，组件不重新构建，无法调用created,故需监听
        this.fetchData()
      }
    },
    methods: {
      fetchData(){
        var self = this;
        self.groupId = self.$route.query.groupId;
        self.clientId = self.$route.query.clientId;
        if(LocalDAO.getNickname()){
          self.isLogin = true;
        }else{
          self.isLogin = false;
        }
        //查询用户组合
        RemoteDAO.callJCL11140(self.clientId, self.groupId, function (response) {
          if (response.error == 0 && response.data.body.status == 0) {
            var group = response.data.body.records[0];
            self.groupName = group.group_name;
            self.totalProfitRate = CommonUtil.toFixed(group.total_profitrate, 2);
            self.totalProfit = CommonUtil.toFixed(group.total_profit, 2);
            self.monthChangeCount = group.month_changecount;
            self.bstealNum = group.bstealnum;
            self.createDate = CommonUtil.formatDate(group.create_date);
            self.groupStatue = group.group_statue;
            self.totalBalance = group.total_balance;
            self.availBalance = CommonUtil.toFixed(group.avail_balance,2);
            self.emptyDate = group.emptydate;
            self.showPosition =true;
            //更新分享数据
            var shareGroup = LocalDAO.getShareGroup();
            shareGroup.client_id = self.clientId;
            shareGroup.group_id = self.groupId;
            shareGroup.isLogin = false;
            _.extend(shareGroup.group_data, group);
            LocalDAO.setShareGroup(shareGroup);

          } else {
            if (response.data == "当前网络不可用，请稍后重试") {
              self.groupStatue = 404;
            }else{
              self.groupStatue = 111; //接口获取失败
            }
            self.error = "组合信息获取失败";
          }
        });
      },
      getCss(){
        if(!this.isLogin && this.groupStatue ==1){
          var w = Number(window.screen.width);//屏幕的宽度
          //令未注册提醒背景图高度与屏幕分辨率相适应
          var h = w*588/750;
          this.$refs.groupPosition.style.height = h-10+"px";
          this.$refs.notLoginBg.style.height = h+"px";
        }
      },
      register(){
        var kv = {"usercode":"","k2":""};
        TDAPP.onEvent("2002","",kv);
        TDAPP.send();
        RemoteDAO.callNativeLogin((response) => {
          if(response.error == 0){
            window.location.reload();
          }else{
            this.$store.dispatch('setTip',{text:response.error});
          }
        });
      }
    }
  }
</script>
